<template>
    <div class="public">
        <div class="w content clearfix">
            <div class="left" id="tab">
                <ul>
                    <li> <router-link to="/Public">捐赠统计</router-link></li>
                    <li><router-link to="/D_data">捐赠数据</router-link></li>
                    <li><router-link to="/D_report">年度报告</router-link></li>
                    <li><router-link to="/D_certificate">相关证书</router-link></li>
                </ul>
            </div>
            <div class="right">
                 <router-view></router-view>
            </div>
        </div>
    </div>
</template>
<script>
import D_count from '../components/Public/D_count.vue'
import D_data from '../components/Public/D_data.vue'
import D_report from '../components/Public/D_report.vue'
import D_certificate from '../components/Public/D_certificate.vue'
    export default{
        data(){
            return {
                 options1: [{
                    value1: '选项1',
                    label: '全部'
                    }, {
                    value1: '选项2',
                    label: '最新'
                    }, {
                    value1: '选项3',
                    label: '浏览最多'
                    }, {
                    value1: '选项4',
                    label: '评论最多'
                }],
                options2: [{
                    value2: '选项1',
                    label: '2014'
                    }, {
                    value2: '选项2',
                    label: '2015'
                    }, {
                    value2: '选项3',
                    label: '2016'
                    }, {
                    value2: '选项4',
                    label: '2017'
                }],
                value1: '',               
                value2: ''
            }
        },
        components: {D_count,D_data,D_report,D_certificate}
    }
</script>
<style scoped>
    .content {
        height: 900px;
        padding-top: 41px;
        background-color: white;

    }

    .content .left {
        float: left;
        /*padding-left: 31px;*/
        width: 167px;
        height: 202px;
        border: 1px solid black;
        margin-right: 45px;

    }

    .content .left li {
        line-height: 50px;
        font-size: 18px;
        font-weight: 800;

    }

    .content li a {
        display: block;
        line-height: 50px;
        width: 165px;
        text-align: center;
    }

    .content li a:hover {
        color: black;
        background-color: #F0F0E1;
    }

    .content .right {
        float: left;
    }

</style>